<!DOCTYPE html>
<html class="x-admin-sm" lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>
        后台管理系统
    </title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" th:href="@{/assets/admin/css/font.css}">
    <link rel="stylesheet" th:href="@{/assets/admin/css/xadmin.css}">
    <script th:src="@{/assets/admin/lib/layui/layui.js}" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/assets/admin/js/xadmin.js}"></script>
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">演示</a>
            <a>
              <cite>导航元素</cite></a>
          </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5" action="" lay-filter="log_sreach_form">
                        <div class="layui-inline layui-show-xs-block">
                            <input class="layui-input" autocomplete="off" placeholder="开始日" name="start" id="start">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <input class="layui-input" autocomplete="off" placeholder="截止日" name="end" id="end">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" id="username" name="username" placeholder="请输入用户名" autocomplete="off"
                                   class="layui-input">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" id="module" name="module" placeholder="请输入模块名" autocomplete="off"
                                   class="layui-input">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" id="logContent" name="logContent" placeholder="请输入操作内容" autocomplete="off"
                                   class="layui-input">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <button type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="sreach">
                                <i class="layui-icon">&#xe615;</i>
                            </button>
                        </div>
                    </form>
                </div>
                <div class="layui-card-header">
                    <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除
                    </button>
                </div>
                <div class="layui-card-body ">
                    <table class="layui-table layui-form" id="table1">
                    </table>
                </div>
<!--                <div class="layui-card-body ">-->
<!--                    <div class="page" id="page">-->
<!--                    </div>-->
<!--                </div>-->
            </div>
        </div>
    </div>
</div>
</body>
<script th:src="@{/assets/admin/js/jquery.min.js}"></script>
<script th:replace="systemCommon/HarinCommon :: commonJs"></script>
<script>
    let roleTable;
    let page = 1;
    let limit = 10;
    let total = 0;
    $(function () {
        // loadData();
        // getPage();
        layui.use(['laydate', 'form','table'], function () {
            laydate = layui.laydate;
            form = layui.form;
            table = layui.table;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });


            //第一个实例
            roleTable = table.render({
                elem: '#table1',
                url: '/system/getSysLogList', //数据接口
                method: "get",
                where: {     //请求参数
                    "username": $("#username").val(),
                    "start": $("#start").val(),
                    "end": $("#end").val(),
                    "module": $("#module").val(),
                    "logContent": $("#logContent").val()
                },
                parseData: function (res) { //res 即为原始返回的数据
                    var data = res.result;
                    return {
                        "code": res.code, //解析接口状态
                        // "msg": res.message, //解析提示文本
                        "count": data.total, //解析数据长度
                        "data": data.records //解析数据列表
                    };
                },
                response: {//重新定义规则
                    //statusName: 'status', //规定数据状态的字段名称，默认：code
                    statusCode: 200, //规定成功的状态码，默认：0
                    //msgName: 'hint', //规定状态信息的字段名称，默认：msg
                    //countName: 'total', //规定数据总数的字段名称，默认：count
                    //dataName: 'rows' //规定数据列表的字段名称，默认：data
                },
                page: true, //开启分页
                limits: [10, 20, 50],//可选条目数
                toolbar: ['filter'],//若需要“列显示隐藏”、“导出”、“打印”等功能，则必须开启该参数
                loading: true, //加载动画
                jump: function(e,t){
                  //console.log(e);
                },
                cols: [
                    [ //表头
                        {type:'checkbox', fixed: 'left'},
                        {field: 'id', title: 'ID', sort: true, fixed: 'left', width:80,unresize:true},
                        {field: 'module', title: '模块',width:120, fixed: 'left'},
                        {field: 'createTime', title: '操作时间', width:200, sort: true,templet : "<div>{{layui.util.toDateString(d.createTime, 'yyyy年MM月dd日 HH:mm:ss')}}</div>"},
                        {field: 'createBy', title: '操作人',width:120},
                        {field: 'ip', title: 'IP地址', sort: true,width:130},
                        {field: 'logContent', title: '操作内容', width:120},
                        {field: 'requestParam', title: '请求参数',templet :'#switchStatus'},
                        {field: 'result', title: '系统处理结果'},
                        {field: 'responseCode', title: '请求结果', sort: true, width:120}
                    ]
                ]
            });

            form.on('submit(sreach)',function(obj){
                roleTable.reload({
                    where : {
                        "username": $("#username").val(),
                        "start": $("#start").val(),
                        "end": $("#end").val(),
                        "module": $("#module").val(),
                        "logContent": $("#logContent").val()
                    },
                    //每次搜索，跳转到第一页。如果不加，每次查询都是上次所在页面，很有可能没有这么多页。导致不加载
                    page:{
                        curr:1
                    }
                });
            });

        });
        //点击行checkbox选中  layui的table单击高亮显示
        $(document).on("click", ".layui-table-body table.layui-table tbody tr", function() {
            var index = $(this).attr('data-index');
            var tableBox = $(this).parents('.layui-table-box');
            //存在固定列
            if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length > 0) {
                tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
            } else {
                tableDiv = tableBox.find(".layui-table-body.layui-table-main");
            }
            var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
            if (checkCell.length > 0) {
                checkCell.click();
            }
        });

        $(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function(e) {
            e.stopPropagation();
        });

        //监听复选框事件，被选中的行高亮显示
        table.on('checkbox(in_reconciliation_table)', function (obj) {
            if (obj.checked == true && obj.type == 'all') {
                //点击全选
                $('.layui-table-body table.layui-table tbody tr').addClass('layui-table-click');
            } else if (obj.checked == false && obj.type == 'all'){
                //点击全不选
                $('.layui-table-body table.layui-table tbody tr').removeClass('layui-table-click');
            } else if (obj.checked == true && obj.type == 'one'){
                //点击单行
                if (obj.checked == true) {
                    obj.tr.addClass('layui-table-click');
                } else {
                    obj.tr.removeClass('layui-table-click');
                }
            } else if (obj.checked == false && obj.type == 'one') {
                //点击全选之后点击单行
                if (obj.tr.hasClass('layui-table-click')) {
                    obj.tr.removeClass('layui-table-click');
                }
            }
        });
    });

    //批量删除提交
    function delAll() {
        layer.confirm('确认要删除吗？', function (index) {
            //捉到所有被选中的，发异步进行删除
            layer.msg('删除成功', {icon: 1});
        });
    }

    /*-删除*/
    function log_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            //发异步删除数据
            $(obj).parents("tr").remove();
            layer.msg('已删除!', {icon: 1, time: 1000});
        });
    }



</script>
</html>